<template>
  <common-page :common-ins="commonIns" :action-bar-data="actionBarData" :columns="columns">
    <dialog-form ref="dialog" :dict-sencetive="dictSencetive" @confirm="commonIns.dialogFn.confirm"></dialog-form>
  </common-page>
</template>

<script setup lang="ts">
import { onMounted, ref, watch } from 'vue';

import $api from '@/api/';
import { dialog, useCommon } from '@/hooks/common';
import CommonPage from '@/pages/common/page/index.vue';

import DialogForm from './components/DialogForm.vue';
import { ACTION_BAR_DATA, COLUMNS } from './constants';

defineOptions({
  name: 'Sencetive',
});

const API = $api.site.sencetive;
const actionBarData = ref([...ACTION_BAR_DATA]);
const columns = ref([...COLUMNS]);
const commonIns = useCommon({ API });

// 获取敏感词类别字典
const dictSencetive = ref<any[]>([]);
const getDictSencetive = async () => {
  const data = await $api.system.dict.values('sencetive');

  dictSencetive.value = data;
};

onMounted(async () => {
  getDictSencetive();
});

watch(commonIns.selectedRowKeys, (val) => {
  actionBarData.value[1].disabled = !val.length;
});
</script>
